

		window.onload=function(){
			
			//放大镜
			var smll_box = document.getElementById("small_box");
			var box1 = document.getElementById("box1");
			var box = document.getElementById("box");
			
//			创建一个img元素,放在box里面的
			var img = document.createElement("img");
//			给img 添加样式,让图片有定位效果
			img.style.position="absolute";
			img.style.width="100%";
			img.style.height="100%";
			img.style.marginLeft="50%";
			img.style.marginTop="50%";
//			把图片添加到box里面
			box.appendChild(img);
			//鼠标移动到small_box元素上的时候触发
			smll_box.onmouseover = function(){
				box1.style.display = "block";
				box.style.display = "block";
				img.src = smll_box.getElementsByTagName("img")[0].src;
			}
			//鼠标移出small_box元素的时候触发
			smll_box.onmouseout = function(){
				box1.style.display = "none";
				box.style.display = "none";
			}
			//鼠标移在small_box元素移动的时候触发
			smll_box.onmousemove = function(e){
				var e = e || window.event;
				var imgX = e.pageX;
				var imgY = e.pageY;
				var box1Left = imgX - smll_box.offsetLeft - box1.offsetWidth/2;
				var box1Top = imgY - smll_box.offsetTop - box1.offsetHeight/2;
				//判断这个box1不能超出这个容器
				if(box1Left < 0){
					box1Left = 0;
				}else if(box1Left > smll_box.offsetWidth - box1.offsetWidth){
					box1Left = smll_box.offsetWidth - box1.offsetWidth;
				}
				//判断这个box1不能超出这个容器
				if(box1Top < 0){
					box1Top = 0;
				}else if(box1Top > smll_box.offsetHeight - box1.offsetHeight){
					box1Top = smll_box.offsetHeight - box1.offsetHeight;
				}
//				将box1Left赋值给box1的left
				box1.style.left = box1Left + "px";
//				将box1Top赋值给box1的Top
				box1.style.top = box1Top + "px";
//				这里得到图片之间的比例关系
				var count=img.offsetWidth/smll_box.getElementsByTagName("img")[0].offsetWidth;
				//box1和box移动的距离关系就是Count这个比例的关系，同时，box1和box这两个元素移动的方向是相反的。
				img.style.left= -box1Left*count+"px";
				img.style.top= -box1Top*count+"px";
			}
			
			
			//图片切换
			
			var switchs=document.getElementById("switch")
			var li=switchs.getElementsByTagName("li");
			var	bigImg=smll_box.getElementsByTagName("img")[0];
			for(var i=0;i<li.length;i++)
			{
				
				li[i].index=i;
				li[i].onmouseover=function(){
					
					li[this.index].className="listBorder";
					bigImg.src=li[this.index].getElementsByTagName("img")[0].getAttribute("src");
				
					
				}
				li[i].onmouseout=function(){
					li[this.index].className="";
					
				}
			}
	
		
			
}

$(function(){
	//增值服务
		$(".service").each(function(){
		
				$(this).click(function(e){
					
						$(this).next().css("display","block");
						$(this).next().find("li").each(function(){
							$(this).mouseover(function(){
								$(this).css({"background":"black","color":"#fff"}).siblings().css({"background":"#fff","color":"#333333"});	
								
							})
							
							$(this).click(function(e){
								var b=$(this).find("b").html();
								var i=$(this).find("i").html();
								$(this).parent().prev().find("b").html(b);
								$(this).parent().prev().find("i").html(i);
								$(this).parent().css("display","none");
								e.stopPropagation();
							})
						})
					e.stopPropagation();
					
				})
				$(document.body).click(function(){
					$(".service").each(function(){
						$(this).next().hide();
					})
				})
			
			
		})
		//优惠套餐
		$("li .meal").each(function(){
			$(this).click(function(){
				$(this).css("border","2px solid red").siblings(".meal").css("border","1px solid #cccccc");
			})
		})
		//点击按钮增加数量
		$(".add").click(function(){
			var num=$(".num").val();
			if(num==="" ||num==null)
			{
				num=1;
			}
			if(isNaN(num))
			{
				num=1;
			}else{
				num=parseInt(num);
			}
			//字符串与数字相加，等于拼接
			$(".num").val(num+1);
		})
		//点击按钮减少数量
		$(".lessen").click(function(){
			var num=$(".num").val();
			if(num==="" ||num==null)
			{
				num=1;
			}
			if(isNaN(num))
			{
				num=1;
			}else{
				num=parseInt(num);
				num-=1;
				if(num<2)
				{
					num=1;
				}
				$(".num").val(num);
				
			}
		
		})
		//输入框输入的内容进行判断
		$(".num").blur(function(){
			var num=$(this).val();
			if(num==="" || num==null)
			{
				num=1;
			}
			if(isNaN(num))
			{
				num=1;
			}
			if(num==0)
			{
				num=1;
			}
			if(num<1)
			{
				num=1;
			}
			num=parseInt(num);
			$(this).val(num);
		})
		//点击加入购物车按钮添加信息
		$("#join-car").click(function(){
			
			var id=1;
			var img=$("#small_box img").attr("src");
			var storeName=$(".box_right h2").text();
			var num=Number($(".num").val());
			var rprice=(Number($("#rprice").text())).toFixed(2);
			var price=(Number($("#price").text())).toFixed(2);
			var sum=(num * price).toFixed(2);
			var biaoji=$(".biaoji");
			var storeInfo={
					img:img,
					storeName:storeName,
					num:num,
					rprice:rprice, //参考价
					price:price, //活动价
					id:id,
					sum:sum
				}
			var storeData=getInfo("storeInfo");
			
			if(!storeData)
			{
				var  storeInfos=[
					storeInfo
				];
				localStorage.setItem("storeInfo",JSON.stringify(storeInfos));
				biaoji.show();
				biaoji.html(1);
			}else{
				/*
				var data=JSON.parse(storeData);
				
				var Data=[data];
				for(var i=0;i<Data.length;i++)
				{
					if(Data[i].id==storeInfo.id)
					{
						Data.splice(i,1,storeInfo);
						localStorage.setItem("storeInfo",JSON.stringify(Data));
					}
					biaoji.show();
					biaoji.html(Data.length);
					
				}
				*/
				
				var data=JSON.parse(storeData);
				data.push(storeInfo);
				localStorage.setItem("storeInfo",JSON.stringify(data));
				biaoji.show();
				biaoji.html(data.length);
				
			}
			
			
			
		})
		//获取本地离线存储
		function getInfo(key){
			return localStorage.getItem(key);
		}
		$("#pay").click(function(){
			Buy();
		})
		
		//立即购买
		function Buy()
		{
			var price=(Number($("#price").text())).toFixed(2);
			var num=Number($(".num").val());
			var sum=(num * price).toFixed(2);
			var storeInfo={
				sum:sum
			}
			var storeInfos=[storeInfo];
			localStorage.setItem("storeInfos",JSON.stringify(storeInfos));
			window.location.href="confirm_order.html";
				
		}
		
		
		
		
		
		//商品信息隐藏、显示
		function Show(){
			var nav=$(".stores_Right");
			var lis=nav.find(".Nav ul li");
			var content=nav.find(".tabs-content>div");
			lis.click(function(){
				var index=$(this).index();
				$(this).addClass("tab-active").siblings().removeClass("tab-active");
				content.eq(index).addClass("on").siblings().removeClass("on");
				
			})
		}
		Show();
		
})


	
		